<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<meta name="decorator" content="default"/>
<title>产品列表</title>
<link rel="stylesheet" type="text/css" href="${ctxStatic }/bootstrap/2.3.1/css_cerulean/bootstrap.css"/>  
<style type="text/css">


.color {
				color: #3399CC;
				text-decoration: none;
			}
 /*导航样式 开始*/
.top_div {
	background: #F6FAFB;
	position: fixed;
	border-bottom: 1px solid #AAAAAA;
	top: 0px;
}


.mianBao {
	display: inline-block;
}


.mianBao a {
	text-decoration: none;
	color: #AAAAAA;
}


.mianBao a:hover {
	cursor: pointer;
	text-decoration: underline;
}
/*导航样式结束*/

/*底部分页*/
			
			.button_ul li {
				display: inline-block;
			}
			
			.button_ul a {
				margin-left: 20px;
				padding: 0 8px 0 8px;
				font-weight: bold;
				background: #F6F6FB;
				color: #3399CC;
				font-family: '黑体';
			}
			
			.button_ul .this_page {
				background: #CACACA;
			}
			
			.color:visited {
				color: #35B0EE;
				text-decoration: none;
				font-weight: bold;
			}
			
			.color:hover {
				text-decoration: underline;
			}

</style>


<script type="text/javascript" src="${ctxStatic }/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript">

		function page(n,s){
			$("#pageNo").val(n);
			$("#pageSize").val(s);
			$("#searchForm").submit();
        	return false;
        }
		
		
		function ajaxpage(type){
			  
			  var currentStr=$("#currentStr").val();
			  
			  var search=$("#search").val();
			  
			  $.ajax({
					type : "POST",
					url : "ajaxProduct",
					data : {
						"currentStr":currentStr,
						"type" :type,
						"valStr":search
					},
					datatype : "datatype",
					success : function(data) {
						
					$("#contentTable tr :gt(0) ").remove();
					
					var productList = data.list;
					  
			for(var i=0; i<productList.length; i++ ){
						  
				 var htmlstr ="<tr>"+
				 "<td style='width: 800px;'><a style='margin-left: 80px;' href='../baseData/productform?id="+productList[i].id+"'>"+productList[i].code+"</a> </td>"+
				 "<td>"+productList[i].status+"</td>"+
				 "<td>"+productList[i].age+"</td>"+
				 "<td>"+productList[i].shipMentCount+"</td>"+
				 "</tr>";   
						  
				 
				 $("#contentTable").append(htmlstr);
			  }
			   var current =data.current;
			    $("#currentStr").val(current);
			    
			    $("#now").text(current);
			    
					},
					error : function(data) {
						alert('数据异常!');
					}
				}); 
		
		}
		
	</script>
	
</head>
<body >

<form:form id="searchForm" modelAttribute="sfProject" action="../baseData/productlist" method="post" class="breadcrumb form-search">
       <input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
		<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
 
</form:form>		
		
		
		<c:set var="bnasLength" value="${fn:length(bnas) }"></c:set>
   <br/>

	<!--面包屑导航-->
	<div class="top_div" style="width: 100%;  color: #AAAAAA; height: 40px;">
		<c:forEach items="${sessionScope.bnas }" var="bna" varStatus="st">
			<div class="mianBao" style="position:relative;top:15px;width: auto;">
				<p align="center">
					<c:choose>
						<c:when test="${st.index==0 }">
							<%-- <a href="${bna.url }?goback=${bnasLength-st.index}">${bna.label }</a> --%>
							<a  style="margin-left: 70px;" href="../baseData/newinterface">首页</a>
						</c:when>
						<c:when test="${st.index==bnasLength-1 }">
							<a href="javascript:">${bna.label }</a>
						</c:when>
						<c:otherwise>
							<c:choose>
								<c:when test="${fn:contains(bna.url,'?')}">
									<a href="${bna.url }&goback=${bnasLength-st.index}">${bna.label }</a>
								</c:when>
								<c:otherwise>
									<a href="${bna.url }?goback=${bnasLength-st.index}">${bna.label }</a>
								</c:otherwise>
							</c:choose>
						</c:otherwise>
					</c:choose>
				</p>
			</div>
			<c:if test="${st.index!=bnasLength-1 }">
		<span style="position:relative;top:15px">>>></span>
			</c:if>
		</c:forEach>
	</div>
		
		
		<!-- project列表 -->
		<c:if test="${not empty list }">
		<div >
		<table id="contentTable" class="table table-striped table-bordered table-condensed">

			<tr>
				
				<th ><font style="margin-left: 80px;">编码</font></th>
				<th>产品状态</th>
				<th>产品年代</th>
				<th>累计发货量</th>
			</tr>
		
		
		<c:forEach items="${list}" var="sfProduct">
			<tr>
				
				<td style="width: 800px;">
				<a style="margin-left: 80px;" href="../baseData/productform?id=${sfProduct.id}">	${sfProduct.code}</a>
				</a></td>
				
			<td>
			 ${sfProduct.status} 
			</td>
				<td>
					${sfProduct.age}
				</td>
				<td>${sfProduct.shipMentCount}</td>
				
			</tr>
		</c:forEach>
		
	</table>
	
	
		
		 
		 <!-- 底部操作 -->
			<br />
			<input type="hidden" value="1" id="currentStr" >
			<input id="search" name="search" type="hidden" value="${search}" >
			
			<div id="pagediv" style="float: left;position: relative;width:100%;" align="center">
				   <ul class="button_ul" style="list-style: none;position: relative;">
					<li>
						<a class="color" href="#" onclick="ajaxpage('startPage')"   >首页</a>
					</li>
					<li>
						<a class="color" href="#" onclick="ajaxpage('hasPrePage')" >上一页</a>
					</li>
					<li>
						<a class="color"  href="#" onclick="ajaxpage('hasNextPage')">下一页</a>
					</li>
					<li>
						<a class="color" href="#" onclick="ajaxpage('endPage')">末页</a>
					</li>
					
					<li>  <a id="now">1</a>&nbsp;&nbsp;&nbsp;/<a id="all">${tp}</a> </li>
					
					<li style="margin-left: 10px;"> 总数： <font >${total}</font>  </li>
				</ul>
			</div>
		
		 
		</c:if>
	
	<c:if test="${empty list }">
		
		<div align="center">
		 <img alt="这是一张图片！"  src="${ctxStatic }/newInterFace/img/woniu.png">
			</div>
			<div style="margin-top: -350px;margin-left: 1000px;">
			 <a href="#"  onclick="window.history.go(-1);return false;"><img alt="tihs img" src="${ctxStatic }/newInterFace/img/fanhui.png"></a>
			</div>
		</div>
		
		</c:if>
		
		
	
	</div>
</body>
</html>